<template>
  <view class="detail-container">
    <view class="detail-list__group">
      <view class="detail-list__item">
        <text class="detail-list__label">时间：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.workTime) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">所属单位：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.deptName) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">装运物种：</text>
        <text class="detail-list__value">{{ detaiData.chemicalName || '--' }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">装运类型：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.formTypeLabel) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">车头车牌：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.frontLicensePlate) || '--'
        }}</text>
        <text class="detail-list__label ml-20">车尾车牌：</text>
        <text class="detail-list__value">
          {{ (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.rearLicensePlate) || '--' }}</text
        >
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">核载重量：</text>
        <text class="detail-list__value">
          {{ (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.nuclearWeigh) || '--' }}吨</text
        >
        <text class="detail-list__label ml-20">实载重量：</text>
        <text class="detail-list__value"
          >{{ (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.realWeight) || '--' }}吨</text
        >
      </view>
    </view>
    <cu-cell-group>
      <cu-cell title="检查表" link @click="checkListClick()"> </cu-cell>

      <cu-cell title="程序表" link @click="procedureClick()"> </cu-cell>

      <cu-cell title="应急预案" description="查看" @click="emergencyClick()"></cu-cell>

      <cu-cell title="安全教育" description="查看" @click="safetyClick()"></cu-cell>
    </cu-cell-group>
    <view class="detail-list__group">
      <view class="detail-list__item">
        <text class="detail-list__label">检查人：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.inspectPersonName) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">驾驶员：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.driverPersonName) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">押运员：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.supercargoPersonName) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">确认人：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.confirmPersonName) || '--'
        }}</text>
      </view>
      <view class="detail-list__item">
        <text class="detail-list__label">审核人：</text>
        <text class="detail-list__value">{{
          (detaiData.dockWorkInfoResp && detaiData.dockWorkInfoResp.processPersonName) || '--'
        }}</text>
      </view>
    </view>
  </view>
</template>
<script>
import CuCellGroup from '@/components/cu-cell/cu-cell-group.vue'
import CuCell from '@/components/cu-cell/cu-cell.vue'
export default {
  components: {
    CuCellGroup,
    CuCell
  },
  props: {
    detaiData: {
      type: Object,
      default: () => {
        dockWorkInfoResp: {
        }
      }
    },
    subWorkId: {
      type: String,
      default: ''
    }
  },
  methods: {
    checkListClick() {
      uni.navigateTo({
        url: `/pages/work/add-load-operation/task/ViewCheckList?readonly=true&subWorkId=${this.subWorkId}`,
        events: {
          // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
          'callback:success': (data) => {}
        }
      })
    },
    procedureClick() {
      uni.navigateTo({
        url: `/pages/work/add-load-operation/task/ViewProcedureList?readonly=true&subWorkId=${this.subWorkId}`,
        events: {
          // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
          'callback:success': (data) => {}
        }
      })
    },
    emergencyClick() {
      let detail =
        this.detaiData.dockWorkInfoResp.formType === '1'
          ? this.detaiData.dockFormLoadingResp
          : this.detaiData.dockFormUnloadResp
      uni.navigateTo({
        url: `/pages/work/add-load-operation/task/ViewEmergency?url=${detail.emergencyPlanFileUrl}&readonly=true&subWorkId=${this.subWorkId}`,
        events: {
          // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
          'callback:success': (data) => {}
        }
      })
    },
    safetyClick() {
      let detail =
        this.detaiData.dockWorkInfoResp.formType === '1'
          ? this.detaiData.dockFormLoadingResp
          : this.detaiData.dockFormUnloadResp
      uni.navigateTo({
        url: `/pages/work/add-load-operation/task/ViewSafety?url=${detail.safetyEducationFileUrl}&readonly=true&subWorkId=${this.subWorkId}`,
        events: {
          // 为指定事件添加一个监听器，获取被打开页面传送到当前页面的数据
          'callback:success': (data) => {}
        }
      })
    }
  }
}
</script>
<style lang="scss" scoped>
.detail-container {
  .detail-list__group {
    padding-left: 30rpx;

    background: #fff;

    .detail-list__item {
      padding: 24rpx 20rpx 24rpx 0;
      border-bottom: 1rpx solid #d5d7e3;
      display: flex;
      line-height: 40rpx;

      .special-work-list__label {
        color: #333;
        flex-shrink: 0;
      }

      .special-work-list__value {
        color: #666;
      }

      &.flex-col {
        flex-direction: column;

        .special-work-list__label {
          margin-bottom: 20rpx;
        }
      }
    }
  }

  .icon-style {
    width: 46rpx;
    height: 46rpx;
  }

  ::v-deep .cu-cell__item .cell-item__title {
    font-size: 14px;
  }
}
</style>
